<template>
  <view class="user__cell">
    <Cell
      icon="icon-setting"
      iconColor="#4990e2"
      title="设置"
      tips="头像、昵称..."
      @eventClick="navTo('/sub-packages/setting/index')"
    />
    <Cell
      icon="icon-qianbi"
      iconColor="#e07472"
      title="我的账户"
      :tips="memberText"
      @eventClick="navTo('/sub-packages/account/index')"
    />
    <Cell
      icon="icon-fenxiang"
      iconColor="#9789f7"
      title="分享"
      @eventClick="navTo('/sub-packages/share/index')"
      tips="邀请好友得30书币"
    />
    <Cell
      icon="icon-yijianfankui"
      iconColor="#54b4ef"
      title="意见反馈"
      open-type="feedback"
      border="none"
      tips="给我们提意见"
      @eventClick="navTo('/sub-packages/feedback/index', true)"
    />
    <Cell
      icon="icon-xiaoxi"
      iconColor="#54b4ef"
      title="联系客服"
      open-type="feedback"
      border="none"
      tips="使用遇到问题?"
      @eventClick="copyWechat"
    />
    <Cell
      icon="icon-guanyuwomen"
      iconColor="#54b4ef"
      title="关于我们"
      :tips="appName"
      @eventClick="navTo('/sub-packages/about-us/index')"
    />
  </view>
</template>

<script>
import Cell from '@/components/Cell';
import { mapGetters } from 'vuex';
import { navigate, get } from '@/utils';
import { APP_NAME } from '../../../config';

export default {
  components: {
    Cell,
  },

  computed: {
    ...mapGetters(['hasLogin', 'baseInfo']),
    memberText() {
      if (this.hasLogin) {
        const name = get(this.baseInfo, 'member.name', '');
        const expired = get(this.baseInfo, 'member.expired', 0);
        const leftTime = expired - Date.now();
        if (name && leftTime >= 0) {
          const days = Math.floor(leftTime / (24 * 60 * 60 * 1000));
          return `您的会员还剩 ${days} 天过期`;
        } else if (name) {
          return name;
        }
      }
      return '书币使用情况';
    },
  },

  data() {
    return {
      appName: APP_NAME,
    };
  },

  methods: {
    navTo(url, needAuth) {
      if (needAuth && !this.hasLogin) {
        this.$toast('尚未登录，请先登录书城');
        setTimeout(() => {
          let redirect = '';
          if (this.$route && this.$route.fullPath) {
            redirect = encodeURIComponent(this.$route.fullPath);
          }
          uni.navigateTo({
            url: `/pages/login/index${
              redirect ? `?redirect=${redirect}&type=navigateBack` : ''
            }`,
          });
        }, 2000);
        return;
      }
      navigate({ url, needAuth: true });
    },

    // 复制客服微信
    copyWechat() {
      uni.setClipboardData({
        data: 'bcydushu',
        success: () => {
          uni.showToast({ title: '已复制微信号', icon: 'none' });
        },
      });
    },
  },
};
</script>

<style lang="scss">
.user__cell {
  white-space: nowrap;
  padding: 30rpx 0 0;
  image {
    display: inline-block;
    width: 160rpx;
    height: 160rpx;
    margin-right: 20rpx;
    border-radius: 10rpx;
  }
}
</style>
